<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Html5-Canvas</title>
</head>
<body>
	<canvas id='my_canvas'></canvas>
</body>

<script>
	var my_canvas = document.getElementById("my_canvas");
	var mtx = my_canvas.getContext("2d");
	// mtx.fillStyle = 'green';
	// mtx.fillRect(0,0,100,100);
	
	////context.createLinearGradient(x0,y0,x1,y1);  起始点，结束点 坐标
	// var my_gradient = mtx.createLinearGradient(0,0,100,100);
	// my_gradient.addColorStop(0,'green');   // 0表示其实   1表示终点   也可以是小数  按比例分配在起点和终点上
	// my_gradient.addColorStop(1,'blue');
	// mtx.fillStyle = my_gradient;
	// mtx.fillRect(0,0,100,100);





</script>
</html>